<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="88px">
      <el-form-item label="姓名" prop="name">
        <el-input
          v-model="queryParams.name"
          placeholder="请输入客户姓名"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="身份证号码" prop="idCard">
        <el-input
          v-model="queryParams.idCard"
          placeholder="请输入客户身份证号码"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="管户机构" prop="orgId">
        <el-select v-model="queryParams.orgId" @change="orgIdBlur(queryParams.orgId)" clearable placeholder="请选择"><el-option v-for="item in orgList" :key="item.value" :label="item.orgName" :value="item.orgId"></el-option></el-select>
      </el-form-item>
      <el-form-item label="管户经理" prop="userId">
        <el-select v-model="queryParams.userId" clearable placeholder="请选择"><el-option v-for="item in mangerList" :key="item.value" :label="item.nickName" :value="item.userName"></el-option></el-select>
      </el-form-item>
      <el-form-item label="客户类型" prop="type">
        <el-select v-model="queryParams.type" placeholder="请选择客户类型">
          <el-option label="存量客户" value="1"></el-option>
          <el-option label="网格商户" value="2"></el-option>
          <el-option label="网格村居" value="3"></el-option>
          <el-option label="网格社区" value="4"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['buss:customer:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['buss:customer:edit']"
        >修改</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="customerList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="姓名" align="center" width="240" prop="name"  />
      <el-table-column label="身份证号" align="center" width="200" prop="idCard" />
      <el-table-column label="性别" align="center" prop="sex"  :formatter="sexFormat" />
      <el-table-column label="年龄" align="center" prop="age"  />
      <el-table-column label="联系电话" width="110" align="center" prop="phone"   />
      <el-table-column label="地址" align="center" width="300" prop="address"   />
      <el-table-column label="客户等级" align="center" prop="customerLevelZh"  :formatter="levelFormat"/>
      <el-table-column label="管户机构" align="center" prop="orgId"   :formatter="orgIdFormat" />
      <el-table-column label="管户经理" align="center" prop="userId"  :formatter="userIdFormat"  />
      <el-table-column label="备注" align="center" prop="remark"  />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <router-link :to="{ path: '/sq/sqdetail/', query: { sqBG: scope.row } }" class="link-type"><span>客户视图  </span></router-link>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改客户信息对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
      <el-form ref="customer" :model="customer" :rules="rules" label-width="120px">
        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNames">
              <el-collapse-item title="存量客户" name="1">
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item  label="姓名" prop="name"><el-input v-model="customer.name" @input="onInput()" placeholder="请输入姓名" clearable :style="{ width: '100%' }"></el-input></el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="身份证号" prop="idCard">
                          <el-input v-model="customer.idCard" placeholder="请输入身份证" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="户主姓名" prop="hzxm">
                          <el-input v-model="customer.hzxm" placeholder="请输入户主姓名" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="户籍编号" prop="hjbh">
                          <el-input v-model="customer.hjbh" placeholder="请输入户籍编号" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="年龄" prop="age"><el-input v-model="customer.age" @input="onInput()" placeholder="请输入年龄" clearable :style="{ width: '100%' }"></el-input></el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="手机号" prop="phone">
                          <el-input v-model="customer.phone" placeholder="请输入手机号" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>

                </div>

                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="管户机构" prop="orgId">
                        <el-select v-model="orgvalue" @change="orgIdBlur(orgvalue)" clearable placeholder="请选择"><el-option v-for="item in orgList" :key="item.value" :label="item.orgName" :value="item.orgId"></el-option></el-select>
                      </el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="管户经理" prop="managerId">
                        <el-select v-model="managervalue" clearable placeholder="请选择"><el-option v-for="item in mangerList" :key="item.value" :label="item.nickName" :value="item.userId"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>

                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="客户类型" prop="khlx">
                          <el-select v-model="khlxvalue" placeholder="请选择">
                              <el-option
                                v-for="item in khlx"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="客群标签" prop="groupLabel">
                          <el-select v-model="qtbqvalue" @change="selectWorkName" multiple placeholder="请选择">
                              <el-option
                                v-for="item in groupList"
                                :key="item.value"
                                :label="item.groupName"
                                :value="`${item.groupName}|${item.groupCode}`">
                              </el-option>
                            </el-select>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>

              </el-collapse-item>

            </el-collapse>
          </div>
        </el-col>

        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNamesss">
              <el-collapse-item title="网格社区" name="1">
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="家庭人口" prop="labour">
                        <el-input v-model="customer.labour" placeholder="请输入家庭人口" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="地址" prop="jzAddress">
                        <el-input v-model="customer.jzAddress" placeholder="请输入地址" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="活动次数" prop="joinAcive">
                        <el-input v-model="customer.joinAcive" placeholder="请输入活动参与次数" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="所属社区" prop="sssjsq">
                        <el-select v-model="customer.sssjsq" @change="sssqBlur(customer.sssjsq)" clearable placeholder="请选择"><el-option v-for="item in sssjsqList" :key="item.value" :label="item.sssjsq" :value="item.sssjsq"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="长期居住" prop="longLive">
                        <el-select v-model="cqjzvalue" clearable placeholder="请选择"><el-option v-for="item in cqjz" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="所属小区" prop="sssq">
                        <el-select v-model="customer.sssq" clearable placeholder="请选择"><el-option v-for="item in xsqList" :key="item.value" :label="item.sssq" :value="item.sssq"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="与户主关系" prop="yhzgx">
                        <el-select v-model="yhzgxvalue" clearable placeholder="请选择"><el-option v-for="item in yhzgx" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="备注" prop="remark">
                        <el-input v-model="customer.remark" placeholder="请输入备注" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
              </el-collapse-item>
            </el-collapse>
          </div>
        </el-col>

        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNamesh" >
              <el-collapse-item title="网格商户" name="1">
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="商户门头" prop="shmt">
                        <el-input v-model="customer.shmt" placeholder="请输入商户门头" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="注册名称" prop="shzcmc">
                        <el-input v-model="customer.shzcmc" placeholder="请输入注册名称" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="法定代表人" prop="fddbr">
                        <el-input v-model="customer.fddbr" placeholder="请输入法定代表人" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="代表人证件" prop="fddbrzjhm">
                        <el-input v-model="customer.fddbrzjhm" placeholder="请输入代表人证件" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="实际经营人" prop="sjjyr">
                        <el-input v-model="customer.sjjyr" placeholder="请输入实际经营人" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="经营人证件" prop="sjjyrzjhm">
                        <el-input v-model="customer.sjjyrzjhm" placeholder="请输入经营人证件" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="经营地址" prop="jydz">
                        <el-input v-model="customer.jydz" placeholder="请输入经营地址" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="所属行业" prop="sshy">
                        <el-select v-model="customer.sshy" clearable placeholder="请选择"><el-option v-for="item in sshy" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="经营状况" prop="jyzk">
                        <el-select v-model="customer.jyzk" clearable placeholder="请选择"><el-option v-for="item in jyzk" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">

                    </div>
                  </el-col>
                </div>
              </el-collapse-item>
            </el-collapse>
          </div>
        </el-col>

        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNamecj" >
              <el-collapse-item title="网格村居" name="1">
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="镇" prop="town">
                        <el-select v-model="customer.town" @change="townBlur(customer.town)" clearable placeholder="请选择"><el-option v-for="item in townList" :key="item.value" :label="item.town" :value="item.town"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="村组" prop="village">
                        <el-select v-model="customer.village" clearable placeholder="请选择"><el-option v-for="item in vellageList" :key="item.value" :label="item.village" :value="item.village"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="居住地址" prop="address">
                        <el-input v-model="customer.address" placeholder="请输入居住地址" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="务工地点" prop="workAddress">
                        <el-input v-model="customer.workAddress" placeholder="请输入务工地点" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="性别" prop="sex">
                        <el-select v-model="xbvalue" clearable placeholder="请选择"><el-option v-for="item in xb" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="与户主关系" prop="yhzgx1">
                        <el-select v-model="cjyhzgxvalue" clearable placeholder="请选择"><el-option v-for="item in cjyhzgx" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="健康状况" prop="health">
                        <el-select v-model="healthvalue" clearable placeholder="请选择"><el-option v-for="item in cjhealth" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="房产" prop="houser">
                        <el-select v-model="houservalue" clearable placeholder="请选择"><el-option v-for="item in houser" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="车产" prop="car">
                        <el-select v-model="carvalue" clearable placeholder="请选择"><el-option v-for="item in car" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="不良嗜好" prop="badHabits">
                        <el-select v-model="badHabitsvalue" clearable placeholder="请选择"><el-option v-for="item in badHabits" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
              </el-collapse-item>
            </el-collapse>
          </div>
        </el-col>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog :title="title" :visible.sync="openUpdata" width="1000px" append-to-body>
      <el-form ref="customer" :model="customerUpdata" :rules="rules" label-width="120px">
        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNames">
              <el-collapse-item title="存量客户" name="1">
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item  label="姓名" prop="name"><el-input v-model="customerUpdata.name" @input="onInput()" placeholder="请输入姓名" clearable :style="{ width: '100%' }"></el-input></el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="身份证号" prop="idCard">
                          <el-input v-model="customerUpdata.idCard" placeholder="请输入身份证" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="户主姓名" prop="hzxm">
                          <el-input v-model="customerUpdata.hzxm" placeholder="请输入户主姓名" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="户籍编号" prop="hjbh">
                          <el-input v-model="customerUpdata.hjbh" placeholder="请输入户籍编号" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="年龄" prop="age"><el-input v-model="customerUpdata.age" @input="onInput()" placeholder="请输入年龄" clearable :style="{ width: '100%' }"></el-input></el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="手机号" prop="phone">
                          <el-input v-model="customerUpdata.phone" placeholder="请输入手机号" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                        </el-form-item>
                      </div>
                    </el-col>

                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="管户机构" prop="orgId">
                        <el-select v-model="orgvalue" @change="orgIdBlur(orgvalue)" clearable placeholder="请选择"><el-option v-for="item in orgList" :key="item.value" :label="item.orgName" :value="item.orgId"></el-option></el-select>
                      </el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="管户经理" prop="managerId">
                        <el-select v-model="managervalue" clearable placeholder="请选择"><el-option v-for="item in mangerList" :key="item.value" :label="item.nickName" :value="item.userId"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>

                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="客户类型" prop="khlx">
                          <el-select v-model="khlxvalue" placeholder="请选择">
                              <el-option
                                v-for="item in khlx"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                              </el-option>
                            </el-select>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>
                <div>
                    <el-col :span="12">
                      <div style="margin: 1.5625rem;font-size: 14px;">
                        <el-form-item label="客群标签" prop="groupLabel">
                          <el-select v-model="qtbqvalue" @change="selectWorkName" multiple placeholder="请选择">
                              <el-option
                                v-for="item in groupList"
                                :key="item.value"
                                :label="item.groupName"
                                :value="`${item.groupName}|${item.groupCode}`">
                              </el-option>
                            </el-select>
                        </el-form-item>
                      </div>
                    </el-col>
                </div>

              </el-collapse-item>

            </el-collapse>
          </div>
        </el-col>

        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNamesss">
              <el-collapse-item title="网格社区" name="1">
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="家庭人口" prop="labour">
                        <el-input v-model="customerUpdata.labour" placeholder="请输入家庭人口" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="地址" prop="address">
                        <el-input v-model="customerUpdata.address" placeholder="请输入地址" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="活动次数" prop="joinAcive">
                        <el-input v-model="customerUpdata.joinAcive" placeholder="请输入活动参与次数" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="所属社区" prop="sssjsq">
                        <el-select v-model="customerUpdata.sssjsq" @change="sssqBlur(customerUpdata.sssjsq)" clearable placeholder="请选择"><el-option v-for="item in sssjsqList" :key="item.value" :label="item.sssjsq" :value="item.sssjsq"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="长期居住" prop="longLive">
                        <el-select v-model="cqjzvalue" clearable placeholder="请选择"><el-option v-for="item in cqjz" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="所属小区" prop="sssq">
                        <el-select v-model="customerUpdata.sssq" clearable placeholder="请选择"><el-option v-for="item in xsqList" :key="item.value" :label="item.sssq" :value="item.sssq"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>

                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="与户主关系" prop="yhzgx">
                        <el-select v-model="yhzgxvalue" clearable placeholder="请选择"><el-option v-for="item in yhzgx" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="备注" prop="remark">
                        <el-input v-model="customerUpdata.remark" placeholder="请输入备注" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
              </el-collapse-item>
            </el-collapse>
          </div>
        </el-col>

        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNamesh" >
              <el-collapse-item title="网格商户" name="1">
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="商户门头" prop="shmt">
                        <el-input v-model="customerUpdata.shmt" placeholder="请输入商户门头" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="注册名称" prop="shzcmc">
                        <el-input v-model="customerUpdata.shzcmc" placeholder="请输入注册名称" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="法定代表人" prop="fddbr">
                        <el-input v-model="customerUpdata.fddbr" placeholder="请输入法定代表人" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="代表人证件" prop="fddbrzjhm">
                        <el-input v-model="customerUpdata.fddbrzjhm" placeholder="请输入代表人证件" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="实际经营人" prop="sjjyr">
                        <el-input v-model="customerUpdata.sjjyr" placeholder="请输入实际经营人" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="经营人证件" prop="sjjyrzjhm">
                        <el-input v-model="customerUpdata.sjjyrzjhm" placeholder="请输入经营人证件" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="经营地址" prop="jydz">
                        <el-input v-model="customerUpdata.jydz" placeholder="请输入经营地址" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="所属行业" prop="sshy">
                        <el-select v-model="customerUpdata.sshy" clearable placeholder="请选择"><el-option v-for="item in sshy" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="经营状况" prop="jyzk">
                        <el-select v-model="customerUpdata.jyzk" clearable placeholder="请选择"><el-option v-for="item in jyzk" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">

                    </div>
                  </el-col>
                </div>
              </el-collapse-item>
            </el-collapse>
          </div>
        </el-col>

        <el-col :span="24">
          <div style="margin: 1.5625rem;font-size: 14px;">
            <el-collapse v-model="activeNamecj" >
              <el-collapse-item title="网格村居" name="1">
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="镇" prop="town">
                        <el-select v-model="customerUpdata.town" @change="townBlur(customerUpdata.town)" clearable placeholder="请选择"><el-option v-for="item in townList" :key="item.value" :label="item.town" :value="item.town"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="村组" prop="village">
                        <el-select v-model="customerUpdata.village" clearable placeholder="请选择"><el-option v-for="item in vellageList" :key="item.value" :label="item.village" :value="item.village"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="居住地址" prop="address">
                        <el-input v-model="customerUpdata.address" placeholder="请输入居住地址" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="务工地点" prop="workAddress">
                        <el-input v-model="customerUpdata.workAddress" placeholder="请输入务工地点" @input="onInput()" clearable :style="{ width: '100%' }"></el-input>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="性别" prop="sex">
                        <el-select v-model="xbvalue" clearable placeholder="请选择"><el-option v-for="item in xb" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="与户主关系" prop="yhzgx1">
                        <el-select v-model="cjyhzgxvalue" clearable placeholder="请选择"><el-option v-for="item in cjyhzgx" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="健康状况" prop="health">
                        <el-select v-model="healthvalue" clearable placeholder="请选择"><el-option v-for="item in cjhealth" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="房产" prop="houser">
                        <el-select v-model="houservalue" clearable placeholder="请选择"><el-option v-for="item in houser" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="车产" prop="car">
                        <el-select v-model="carvalue" clearable placeholder="请选择"><el-option v-for="item in car" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
                <div>
                  <el-col :span="12">
                    <div style="margin: 1.5625rem;font-size: 14px;">
                      <el-form-item label="不良嗜好" prop="badHabits">
                        <el-select v-model="badHabitsvalue" clearable placeholder="请选择"><el-option v-for="item in badHabits" :key="item.value" :label="item.label" :value="item.value"></el-option></el-select>
                      </el-form-item>
                    </div>
                  </el-col>
                </div>
              </el-collapse-item>
            </el-collapse>
          </div>
        </el-col>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormUpData">确 定</el-button>
        <el-button @click="cancelUpData">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listCustomer, getCustomer, delCustomer, addCustomer, updateCustomer, queryCustomerInfo } from "@/api/buss/customer";
import { listSqzxt, getSqzxt, delSqzxt, addSqzxt, updateSqzxt, selectSssqList, orglist, queryManager, addWgsq, listGroup } from '@/api/buss/sqzxt';
import { selectTownOrVillage} from "@/api/buss/gridCJ";

export default {
  name: "Customer",
  components: {
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      activeNames: ['1'],
      activeNamesss: ['1'],
      activeNamesh: ['1'],
      activeNamecj: ['1'],
      townvalue: '',
      villagevalue: '',
      customerUpdata: {
        name: '',
        idCard: '',
        hzxm: '',
        hjbh: '',
        age: '',
        phone: '',
        labour: '',
        address: '',
        joinAcive: '',
        sssq: '',
        longLive: '',
        yhzgx: '',
        orgId: '',
        managerId: '',
        remark: '',
        sssjsq: '',
        khlx: '',
        groupLabel: '',
        sshy: '',
        jyzk: '',
        jydz: '',
        sjjyrzjhm: '',
        sjjyr: '',
        fddbrzjhm: '',
        fddbr: '',
        shzcmc: '',
        shmt: '',
        town: '',
        village: '',
        jzAddress: '',
        workAddress: '',
        sex: '',
        yhzgx1: '',
        health: '',
        car: '',
        hourse: '',
        badHabits: ''
      },
      customer: {
        name: '',
        idCard: '',
        hzxm: '',
        hjbh: '',
        age: '',
        phone: '',
        labour: '',
        address: '',
        joinAcive: '',
        sssq: '',
        longLive: '',
        yhzgx: '',
        orgId: '',
        managerId: '',
        remark: '',
        sssjsq: '',
        khlx: '',
        groupLabel: '',
        sshy: '',
        jyzk: '',
        jydz: '',
        sjjyrzjhm: '',
        sjjyr: '',
        fddbrzjhm: '',
        fddbr: '',
        shzcmc: '',
        shmt: '',
        town: '',
        village: '',
        jzAddress: '',
        workAddress: '',
        sex: '',
        yhzgx1: '',
        health: '',
        car: '',
        hourse: '',
        badHabits: ''
      },
      cjyhzgx: [
        {
          value: '1',
          label: '户主'
        },
        {
          value: '2',
          label: '配偶'
        },
        {
          value: '3',
          label: '父母'
        },
        {
          value: '4',
          label: '子女'
        },
        {
          value: '5',
          label: '其他'
        }
      ],
      cjyhzgxvalue: '',
      cjhealth: [
        {
          value: '0',
          label: '健康'
        },
        {
          value: '1',
          label: '一般'
        },
        {
          value: '2',
          label: '重大疾病'
        }
      ],
      healthvalue: '',
      car: [
        {
          value: '0',
          label: '私家车'
        },
        {
          value: '1',
          label: '大型农机'
        },
        {
          value: '2',
          label: '无'
        }
      ],
      carvalue: '',
      houser: [
        {
          value: '0',
          label: '农村平方'
        },
        {
          value: '1',
          label: '农村楼房'
        },
        {
          value: '2',
          label: '县级以上商品房'
        }
      ],
      houservalue: '',
      badHabits: [
        {
          value: '0',
          label: '有'
        },
        {
          value: '1',
          label: '无'
        }
      ],
      badHabitsvalue: '',
      xb: [
        {
          value: '0',
          label: '男'
        },
        {
          value: '1',
          label: '女'
        }
      ],
      xbvalue: '',
      cqjz: [
        {
          value: '0',
          label: '是'
        },
        {
          value: '1',
          label: '否'
        }
      ],
      cqjzvalue: '',
      khlx: [
        {
          value: '0',
          label: '普通客户'
        },
        {
          value: '1',
          label: '潜在客户'
        },
        {
          value: '2',
          label: '重点客户'
        }
      ],
      khlxvalue: '',
      jyzk: [
        {
          value: '0',
          label: '关闭'
        },
        {
          value: '1',
          label: '正常'
        },
        {
          value: '2',
          label: '其他'
        }
      ],
      jyzkvalue: '',
      yhzgx: [
        {
          value: '1',
          label: '户主'
        },
        {
          value: '2',
          label: '配偶'
        },
        {
          value: '3',
          label: '父母'
        },
        {
          value: '4',
          label: '子女'
        },
        {
          value: '5',
          label: '其他'
        }
      ],
      yhzgxvalue: '',
      sshy: [
        {
          value: '1',
          label: '餐饮'
        },
        {
          value: '2',
          label: '住宿'
        },
        {
          value: '3',
          label: '商超零售'
        },
        {
          value: '4',
          label: '水产批发'
        },
        {
          value: '5',
          label: '汽车服务'
        },
        {
          value: '6',
          label: '居民服务'
        },
        {
          value: '7',
          label: '其他'
        }
      ],
      sshyvalue: '',
      orgvalue: '',
      sssq: '',
      orgList: [],
      sqKhxx: [],
      sqtype: {
        type: '1'
      },
      xqtype: {
        type: '2',
        sssjsq: ''
      },
      // 机构ID字典
      orgIdOptions: [],
      sssjsqList: [],
      sssjsqvalue: '',
      xsqList: [],
      xqvalue: '',
      manger: {
        orgId: ''
      },
      mangerList: [],
      managervalue: '',
      qtbqvalue: '',
      groupList: [],
      ifUpAndAdd: false,
      upDateId: '',
      queryInfo: {},
      // 客户信息表格数据
      customerList: [],
      // 性别字典
      sexOptions: [],
      levelOptions: [],
      userIdOptions: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      openUpdata: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        id: null,
        name: null,
        sex: null,
        age: null,
        idCard: null,
        spouseName: null,
        phone: null,
        address: null,
        maritalStatus: null,
        customerType: null,
        customerLevel: null,
        points: null,
        createTime: null,
        updateTime: null,
        status: null,
        remark: null,
        luojiJingdu: null,
        luojiWeidu: null,
        zhenshiJingdu: null,
        zhenshiWeidu: null,
        mapPic: null,
        ifFenpei: null,
        isPublic: null,
        customerLevelZh: null,
        orgId: '',
        managerId: null,
        userId: '',
        color: null,
        birthday: null,
        createUser: null,
        updateUser: null,
        idCardShow: null,
        isExpand: null,
        type: ''
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        name: [
               { required: true, message: '姓名不能为空', trigger: 'blur' },
                 { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
               ],
        // sshy: [
        //    {required: true, message: "所属行业不能为空" ,trigger: 'blur'},
        // ],
        // shmt: [
        //    {required: true, message: "商户门头不能为空" ,trigger: 'blur'},
        // ],
        // jyzk: [
        //    {required: true, message: "经营状况不能为空" ,trigger: 'blur'},
        // ],
        // sssjsq: [
        //    {required: true, message: "所属小区不能为空" ,trigger: 'blur'},
        // ],
        // sssq: [
        //    {required: true, message: "所属社区不能为空" ,trigger: 'blur'},
        // ],
        // town: [
        //    {required: true, message: "镇不能为空" ,trigger: 'blur'},
        // ],
        // village: [
        //    {required: true, message: "村组不能为空" ,trigger: 'blur'},
        // ],

      },
      zhen: {
        cjType: '3'      },
      cunzu: {
        cjType: '1',
        town: ''
      },
      townList: [],
      vellageList: []
    };
  },
  created() {
    this.getList();
    this.getDicts("sys_user_sex").then(response => {
      this.sexOptions = response.data;
    });
    this.getDicts("data_customer_level").then(response => {
      this.levelOptions = response.data;
    });
    this.getDicts("sys_org_id").then(response => {
      this.orgIdOptions = response.data;
    });
    this.getDicts("sys_user_id").then(response => {
      this.userIdOptions = response.data;
    });
  },
  methods: {
    /** 查询客户信息列表 */
    getList() {
      this.loading = true;
      listCustomer(this.queryParams).then(response => {
        this.customerList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
      //下拉社区
      selectSssqList(this.sqtype).then(response => {
        this.sssjsqList = response;
        //console.log(JSON.stringify(this.sssjsqList))
      });
      //下拉机构
      orglist().then(response => {
        this.orgList = response.rows;
      });
      //客群标签
      listGroup().then(response => {
         this.groupList = response.rows;
      });
      //镇
      selectTownOrVillage(this.zhen).then(response => {
        this.townList = response.data;

      });
    },
    /** 点击客户视图操作 */
    handleDetailTable(row) {
      const tableId = row.idCard;
      var path = "/buss/detailTable/" + tableId;
      console.log(path);
      // this.$router.push("/buss/detailTable/" + tableId);
      this.$router.push({name:'CustomerInfo',params: {"tableId":tableId}});

    },
    onInput() {
      this.$forceUpdate();
    },
    cancelUpData() {
      this.openUpdata = false;
      this.reset();
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },

    townBlur(townvalue) {
      this.cunzu.town = townvalue
      selectTownOrVillage(this.cunzu).then(response => {
        this.vellageList = response.data;
        //console.log(JSON.stringify(this.sssjsqList))
      });
    },

    sssqBlur(sssjsqvalue) {
      //下拉小区
      this.xqtype.sssjsq = sssjsqvalue
      selectSssqList(this.xqtype).then(response => {
        this.xsqList = response;
        //console.log(JSON.stringify(this.sssjsqList))
      });
      console.log(sssjsqvalue)
    },

    //客户经理
    orgIdBlur(mg) {
      this.manger.orgId = mg;
      queryManager(this.manger).then(response => {
        this.mangerList = response.rows;
      });
    },
    orgIdBlurSelsct(mg) {
      console.log(mg)
      this.manger.orgId = mg;
      queryManager(this.manger).then(response => {
        this.mangerList = response.rows;
      });
    },

    selectWorkName(id){
      var sp = JSON.stringify(this.qtbqvalue);
      let [lable,vaue] = sp.split('|')
        console.log(vaue)
        console.log("select中对应value值",JSON.stringify(this.qtbqvalue))



         },

    // 性别字典翻译
    sexFormat(row, column) {
      return this.selectDictLabel(this.sexOptions, row.sex);
    },
    levelFormat(row, column) {
      return this.selectDictLabel(this.levelOptions, row.customerLevelZh);
    },
    orgIdFormat(row, column) {
      return this.selectDictLabel(this.orgIdOptions, row.orgId);
    },
    userIdFormat(row, column) {
      return this.selectDictLabel(this.userIdOptions, row.userId);
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        name: null,
        sex: null,
        age: null,
        idCard: null,
        spouseName: null,
        phone: null,
        address: null,
        maritalStatus: "0",
        customerType: null,
        customerLevel: null,
        points: null,
        createTime: null,
        updateTime: null,
        status: "0",
        remark: null,
        luojiJingdu: null,
        luojiWeidu: null,
        zhenshiJingdu: null,
        zhenshiWeidu: null,
        mapPic: null,
        ifFenpei: null,
        isPublic: null,
        customerLevelZh: null,
        orgId: null,
        managerId: null,
        userId: null,
        color: null,
        birthday: null,
        createUser: null,
        updateUser: null,
        idCardShow: null,
        isExpand: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length

      this.sqKhxx = selection;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.sqKhxx = [];
      this.reset();
      this.open = true;
      this.title = "添加客户信息";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids

      this.rules = {};
      queryCustomerInfo(this.sqKhxx[0].idCard).then(response => {
        this.queryInfo = response.data;
        console.log(JSON.stringify(this.queryInfo.dataWgWgsq.length))
        this.upDateId = this.queryInfo.id;
        if(this.queryInfo.dataWgWgsq.length > 0){
          this.customerUpdata.labour = this.queryInfo.dataWgWgsq[0].labour;
          this.sssjsqvalue = this.queryInfo.dataWgWgsq[0].sssq;
          this.xqvalue = this.queryInfo.dataWgWgsq[0].sssjsq;
          this.cqjzvalue = this.queryInfo.dataWgWgsq[0].longLive;
        }
        if(this.queryInfo.dataGtgsh.length > 0){
          this.customerUpdata.shmt = this.queryInfo.dataGtgsh[0].shmt;
          this.customerUpdata.shzcmc = this.queryInfo.dataGtgsh[0].shzcmc;
          this.customerUpdata.fddbr = this.queryInfo.dataGtgsh[0].fddbr;
          this.customerUpdata.fddbrzjhm = this.queryInfo.dataGtgsh[0].fddbrzjhm;
          this.customerUpdata.sjjyr = this.queryInfo.dataGtgsh[0].sjjyr;
          this.customerUpdata.sjjyrzjhm = this.queryInfo.dataGtgsh[0].sjjyrzjhm;
          this.customerUpdata.jydz = this.queryInfo.dataGtgsh[0].jydz;
          this.sshyvalue = this.queryInfo.dataGtgsh[0].sshy;
          this.jyzkvalue = this.queryInfo.dataGtgsh[0].jyzk;
        }
        if(this.queryInfo.dataWgWgcj.length > 0){
          this.customerUpdata.town = this.queryInfo.dataWgWgcj[0].town;
          this.customerUpdata.village = this.queryInfo.dataWgWgcj[0].village;
          this.customerUpdata.workAddress = this.queryInfo.dataWgWgcj[0].workAddress;
          this.badHabitsvalue = this.queryInfo.dataWgWgcj[0].badHabits;
          this.xbvalue = this.queryInfo.dataWgWgcj[0].sex;
          this.cjyhzgxvalue = this.queryInfo.dataWgWgcj[0].yhzgx;
          this.healthvalue = this.queryInfo.dataWgWgcj[0].health;
          this.houservalue = this.queryInfo.dataWgWgcj[0].hourse;
          this.carvalue = this.queryInfo.dataWgWgcj[0].car;
        }
      });

      this.customerUpdata.name = this.sqKhxx[0].name;
      this.customerUpdata.idCard = this.sqKhxx[0].idCard;
      this.customerUpdata.hzxm = this.sqKhxx[0].hzxm;
      this.customerUpdata.hjbh = this.sqKhxx[0].hjbh;
      this.customerUpdata.age = this.sqKhxx[0].age;
      this.customerUpdata.phone = this.sqKhxx[0].phone;


      this.customerUpdata.address = this.queryInfo.address;
      this.customerUpdata.joinAcive = this.sqKhxx[0].joinAcive;


      this.yhzgxvalue = this.sqKhxx[0].yhzgx;
      this.orgvalue = this.queryInfo.orgId;
      this.managervalue = this.queryInfo.userId;
      this.khlxvalue = this.queryInfo.customerType;
      this.customerUpdata.remark = this.sqKhxx[0].remark;

      //this.form = response.data;
      this.openUpdata = true;
      this.title = "修改客户信息";
      this.ifUpAndAdd = row.isTrusted;
      // getCustomer(id).then(response => {

      // });
    },
    submitFormUpData() {
      var group = [];
      for (var i = 0; i < this.qtbqvalue.length; i++) {

            group.push({
                 groupCode: this.qtbqvalue[i].split('|')[1],
                 groupName: this.qtbqvalue[i].split('|')[0]
            })
      }
      var sqData = {
        name: this.customerUpdata.name,
        idCard: this.customerUpdata.idCard,
        hzxm: this.customerUpdata.hzxm,
        hjbh: this.customerUpdata.hjbh,
        age: this.customerUpdata.age,
        phone: this.customerUpdata.phone,
        groupLabel: group,
        customerType: this.khlxvalue,
        orgId: this.orgvalue,
        userId: this.managervalue,
        id: this.upDateId,
        dataGtgsh: [{}],
        dataWgWgsq: [{}],
        dataWgWgcj: [{}]

      }

      if(this.queryInfo.dataWgWgsq.length > 0){
        sqData.dataWgWgsq[0].id = this.queryInfo.dataWgWgsq[0].id;
        sqData.dataWgWgsq[0].yhzgx = this.yhzgxvalue;
        sqData.dataWgWgsq[0].remark = this.customer.remark;
        sqData.dataWgWgsq[0].managerId = this.managervalue;
        sqData.dataWgWgsq[0].orgId = this.orgvalue;
        sqData.dataWgWgsq[0].sssq = this.customerUpdata.sssq;
        sqData.dataWgWgsq[0].labour = this.customerUpdata.labour;
        sqData.dataWgWgsq[0].jzAddress = this.customerUpdata.jzAddress;
        sqData.dataWgWgsq[0].joinAcive = this.customerUpdata.joinAcive;
        sqData.dataWgWgsq[0].sssjsq = this.customerUpdata.sssjsq;
        sqData.dataWgWgsq[0].longLive = this.cqjzvalue;
      }else{
        sqData.dataWgWgsq = [];
      }

      if(this.queryInfo.dataGtgsh.length > 0){
        sqData.dataGtgsh[0].shmt = this.customerUpdata.shmt;
        sqData.dataGtgsh[0].shzcmc = this.customerUpdata.shzcmc;
        sqData.dataGtgsh[0].fddbr = this.customerUpdata.fddbr;
        sqData.dataGtgsh[0].fddbrzjhm = this.customerUpdata.fddbrzjhm;
        sqData.dataGtgsh[0].sjjyr = this.customerUpdata.sjjyr;
        sqData.dataGtgsh[0].sjjyrzjhm = this.customerUpdata.sjjyrzjhm;
        sqData.dataGtgsh[0].jydz = this.customerUpdata.jydz;
        sqData.dataGtgsh[0].sshy = this.customerUpdata.sshy;
        sqData.dataGtgsh[0].jyzk = this.customerUpdata.jyzk;
        sqData.dataGtgsh[0].id = this.queryInfo.dataGtgsh[0].id;
        sqData.dataGtgsh[0].sssq = this.customerUpdata.sssq;
        sqData.dataGtgsh[0].sssjsq = this.customerUpdata.sssjsq;
      }else{
        sqData.dataGtgsh = [];
      }

      if(this.queryInfo.dataWgWgcj.length > 0){
        sqData.dataWgWgcj[0].id = this.queryInfo.dataWgWgcj[0].id;
        sqData.dataWgWgcj[0].town = this.customerUpdata.town;
        sqData.dataWgWgcj[0].village = this.customerUpdata.village;
        sqData.dataWgWgcj[0].sex = this.xbvalue;
        sqData.dataWgWgcj[0].yhzgx = this.cjyhzgxvalue;
        sqData.dataWgWgcj[0].health = this.healthvalue;
        sqData.dataWgWgcj[0].car = this.carvalue;
        sqData.dataWgWgcj[0].hourse = this.houservalue;
        sqData.dataWgWgcj[0].badHabits = this.badHabitsvalue;
        sqData.dataWgWgcj[0].address = this.customerUpdata.address;
        sqData.dataWgWgcj[0].workAddress = this.customerUpdata.workAddress;
      }else{
        sqData.dataWgWgcj = [];
      }



      this.ifUpAndAdd = true;
      console.log(sqData)
      updateCustomer(sqData).then(response => {
        this.msgSuccess("修改成功");
        this.openUpdata = false;
        this.getList();
      });
    },
    /** 提交按钮 */
    submitForm() {
       var group = [];

       for (var i = 0; i < this.qtbqvalue.length; i++) {

             group.push({
                  groupCode: this.qtbqvalue[i].split('|')[1],
                  groupName: this.qtbqvalue[i].split('|')[0]
             })
       }
       var sqData = {
         name: this.customer.name,
         idCard: this.customer.idCard,
         hzxm: this.customer.hzxm,
         hjbh: this.customer.hjbh,
         age: this.customer.age,
         phone: this.customer.phone,
         groupLabel: group,
         customerType: this.khlxvalue,
         orgId: this.orgvalue,
         userId: this.managervalue,
         dataGtgsh: [{}],
         dataWgWgsq: [{}],
         dataWgWgcj: [{}]

       }

       if(this.customer.town != ""){
         sqData.dataWgWgcj[0].town = this.customer.town;
       }else{
         sqData.dataWgWgcj = [];
       }
       if(this.customer.village != ""){
         sqData.dataWgWgcj[0].village = this.customer.village;
       }else{
         sqData.dataWgWgcj = [];
       }

       if(this.customer.sex != ""){
         sqData.dataWgWgcj[0].sex = this.xbvalue;
       }
       if(this.cjyhzgxvalue != ""){
         sqData.dataWgWgcj[0].yhzgx = this.cjyhzgxvalue;
       }
       if(this.healthvalue != ""){
         sqData.dataWgWgcj[0].health = this.healthvalue;
       }
       if(this.houservalue != ""){
         sqData.dataWgWgcj[0].hourse = this.houservalue;
       }
       if(this.carvalue != ""){
         sqData.dataWgWgcj[0].car = this.carvalue;
       }
       if(this.badHabitsvalue != ""){
         sqData.dataWgWgcj[0].badHabits = this.badHabitsvalue;
       }
       if(this.customer.address != ""){
         sqData.dataWgWgcj[0].address = this.customer.address;
       }
       if(this.customer.workAddress != ""){
         sqData.dataWgWgcj[0].workAddress = this.customer.workAddress;
       }

       if(this.customer.shmt!=""){
         sqData.dataGtgsh[0].shmt = this.customer.shmt;
       }else{
         sqData.dataGtgsh = [];
       }
       if(this.customer.shzcmc!=""){
         sqData.dataGtgsh[0].shzcmc = this.customer.shzcmc;
       }
       if(this.customer.fddbr!=""){
         sqData.dataGtgsh[0].fddbr = this.customer.fddbr;
       }
       if(this.customer.fddbrzjhm!=""){
         sqData.dataGtgsh[0].fddbrzjhm = this.customer.fddbrzjhm;
       }
       if(this.customer.sjjyr!=""){
         sqData.dataGtgsh[0].sjjyr = this.customer.sjjyr;
       }
       if(this.customer.sjjyrzjhm!=""){
         sqData.dataGtgsh[0].sjjyrzjhm = this.customer.sjjyrzjhm;
       }
       if(this.customer.jydz!=""){
         sqData.dataGtgsh[0].jydz = this.customer.jydz;
       }
       if(this.customer.sshy!=""){
         sqData.dataGtgsh[0].sshy = this.customer.sshy;
       }
       if(this.customer.jyzk!=""){
         sqData.dataGtgsh[0].jyzk = this.customer.jyzk;
       }
       if(this.customer.sssjsq!=""){
         sqData.dataGtgsh[0].sssjsq = this.customer.sssjsq;
       }
       if(this.customer.sssq!=""){
         sqData.dataGtgsh[0].sssq = this.customer.sssq;
       }

       if(this.yhzgxvalue!=""){
         sqData.dataWgWgsq[0].yhzgx = this.yhzgxvalue;
       }
       if(this.customer.remark!=""){
         sqData.dataWgWgsq[0].remark = this.customer.remark;
       }
       if(this.managervalue!=""){
         sqData.dataWgWgsq[0].managerId = this.managervalue;
       }
       if(this.orgvalue!=""){
         sqData.dataWgWgsq[0].orgId = this.orgvalue;
       }
       if(this.customer.sssq!=""){
         sqData.dataWgWgsq[0].sssq = this.customer.sssq;
       }
       if(this.customer.labour!=""){
         sqData.dataWgWgsq[0].labour = this.customer.labour;
       }
       if(this.customer.jzAddress!=""){
         sqData.dataWgWgsq[0].jzAddress = this.customer.jzAddress;
       }
       if(this.customer.joinAcive!=""){
         sqData.dataWgWgsq[0].joinAcive = this.customer.joinAcive;
       }
       if(this.customer.sssjsq!=""){
         sqData.dataWgWgsq[0].sssjsq = this.customer.sssjsq;
       }else{
         sqData.dataWgWgsq = []
       }
       if(this.cqjzvalue!=""){
         sqData.dataWgWgsq[0].longLive = this.cqjzvalue;
       }
       console.log(sqData)
       addCustomer(sqData).then(response => {
         this.msgSuccess("新增成功");
         this.open = false;
         this.getList();
       });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$confirm('是否确认删除客户信息编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delCustomer(ids);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('buss/customer/export', {
        ...this.queryParams
      }, `buss_customer.xlsx`)
    }
  }
};
</script>
